<template>
  <view>
    <l-form-cell v-if="type!=2" label="司机头像" has-slot :unlined="driverInfo.examineStatus != 3 && driverInfo.examineStatus != 0 && !disabled" @click="uploadAvatar">
      <view class="form-item flex-row align-center justify-end">
        <l-avatar :avatar="form.avatar" :default="defaultImg" size="90rpx" type="square" />
      </view>
    </l-form-cell>
    <l-form-cell v-if="!driverId" v-model="form.phone" label="手机号" type="number" :disabled="disabled" :maxlength="11" placeholder="请输入司机手机号" :must="!disabled" @click="cell" />
    <l-form-cell v-if="driverInfo.examineStatus == 3 || driverInfo.examineStatus == 0" v-model="form.nickname" :disabled="disabled" label="姓名" :unlined="type!=2 && !disabled" placeholder="请输入姓名" :must="!disabled" />
    <l-form-cell v-if="disabled" :value="sex" :disabled="disabled" label="性别" />
    <l-form-cell v-if="disabled" :value="status" :disabled="disabled" label="状态" unlined />
  </view>
</template>

<script>
import { saveImage, viewImage, cellPhone } from '@/common/util'
import { driverStatus } from '@/driver/index'
export default {
  name: 'DriverInfoModel',
  props: {
    data: {
      type: Object,
      default: () => {}
    },
    defaultImg: {
      type: String,
      default: 'https://tbb-file.oss-cn-shenzhen.aliyuncs.com/tbb_admin_app/static/card_cert.png'
    },
    driverId: {
      type: String,
      default: ''
    },
    driverInfo: {
      type: Object,
      default: () => {}
    },
    type: {
      type: [String, Number],
      default: 0
    },
    disabled: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      form: {
        avatar: '',
        phone: '',
        nickname: ''
      }
    }
  },
  computed: {
    sex() {
      if (this.data.gender === 1) return '男'
      if (this.data.gender === 2) return '女'
      return '未知'
    },
    status() {
      driverStatus.forEach(item => {
        if (this.data.status === item.value) return item.label
      })
      return '在岗'
    }
  },
  watch: {
    data: {
      handler(e) {
        Object.keys(this.form).forEach(item => {
          this.form[item] = e[item]
        })
      },
      deep: true
    },
    form: {
      handler() {
        this.$emit('update', this.form)
      },
      deep: true
    }
  },
  methods: {
    // 上传头像
    uploadAvatar() {
      if (this.disabled) {
        if (this.form.avatar) {
          viewImage(0, [this.form.avatar])
        }
        return
      }
      saveImage('driver').then(src => {
        this.form.avatar = src
      })
    },
    cell() {
      cellPhone(this.form.phone)
    }
  }
}
</script>

<style scoped>

</style>
